{% extends 'web_base.html' %}
{% load staticfiles %}
{% block css_js %}
    <link rel="stylesheet" href={% static "css/goods_sort.css" %}>
    <script src={% static "js/goods_sort.js" %}></script>

{% endblock %}
{% block title %}
    商品搜索
{% endblock %}




{% block web_body %}
    <div class="nav">
        <div class="container">
            <ul class="breadcrumb">
                <li><a href="{% url 'goods:index' %}">首页</a></li>
                <li>{% block Crumbs %}{{ query }}{% endblock %}</li>
            </ul>
        </div>
    </div>

    <div class="list_body">
        <div class="container">
            <div class="row">
                <div class="goods">

                    {% for item in page %}

                        <div class="col-lg-4 col-md-4">
                            <a href={% url 'goods:goods_detail' item.object.id  %} class="thumbnail">
                                <img src="{{ item.object.image.url }}" alt="通用的占位符缩略图" class="img-responsive">
                                <p class="tit">{{ item.object.name }}</p>
                                <p class="price">¥{{ item.object.price }}</p>
                            </a>
                        </div>
                    {% empty %}
                        空
                    {% endfor %}

                </div>

            </div>
             <div  aria-label="Page navigation">
                        <ul class="pagination">
                            {% if page.has_previous %}
                                <li>
                                    <a href="/computer/search?q={{ query }}&page={{ page.previous_page_number }}" aria-label="Previous">
                                        <span aria-hidden="true">&laquo;</span>
                                    </a>
                                </li>
                            {% endif %}


                            {% for pindex in paginator.page_range %}
                                {% if pindex == page.number %}
                                    <li><a href="/computer/search?q={{ query }}&page={{ pindex }}" style="color: red;">{{ pindex}}</a></li>
                                {% else %}
                                     <li><a href="/computer/search?q={{ query }}&page={{ pindex }}">{{ pindex }}</a></li>
                                {% endif %}
                            {% endfor %}


                            {% if page.has_next %}
                                <li>
                                    <a href="/computer/search?q={{ query }}&page={{ page.next_page_number }}" aria-label="Next">
                                        <span aria-hidden="true">&raquo;</span>
                                    </a>
                                </li>
                            {% endif %}
                        </ul>
                    </div>

        </div>

    </div>

{% endblock %}








